<mat-card class="card">
  <mat-card-header>
    <h3 mat-card-title>{{ 'New Devices' | translate }}</h3>
  </mat-card-header>
  <mat-card-content>
    <div>

      @for (category of topology$ | async | keyvalue; track category.key) {
        <div class="details-item">
          <span class="label">
            {{ category.key | mapValue: vdevTypeLabels | translate }}:
          </span>
          <span class="value">
            {{ category.value | ixTopologyCategoryDescription: !isLimitedToOneLayout(category.key | cast) : category.key === vDevType.Spare }}
          </span>
        </div>
      }

    </div>
  </mat-card-content>
</mat-card>
